<div class="header-top">
	<div class="header-wrapper">
		<a href="#" class="utopia-logo"><img src="<?php echo base_url()?>webpage/img/utopia-logo.png" alt="Utopia"></a>
		<div class="header-right">
			<div class="header-divider">
				&nbsp;
			</div>
			<div class="search-panel header-divider">
				<div class="search-box"><img src="<?php echo base_url()?>webpage/img/icons/zoom.png" alt="Search">
					<form action="" method="post">
						<input type="text" name="search" placeholder="search"/>
					</form>
				</div>
			</div>
			<div class="notification header-divider">
				<div class="notification-wrapper">
					<a href="#" class="notification-counter">8</a><div id="triangle-down"></div>
					<div class="tabbable notification-box">
						<ul class="nav nav-tabs">
							<li class="active">
								<a data-toggle="tab" href="#message">Messages (3)</a>
							</li>
							<li class="">
								<a data-toggle="tab" href="#activity">Activity (5)</a>
							</li>
						</ul>
						<div class="tab-content">
							<div id="message" class="tab-pane active">
								<ul class="message-list">
									<li class="message new">
										<div class="msg">
											From: <a href="">Benjamiin Buttons</a><span>40m ago</span><a class="subject" href="">Getting Started on Starlight Template</a>
											<p>
												Vitae dicta sunt explicabo. Nemo enim
											</p>
										</div>
									</li>
									<li class="message new">
										<div class="msg">
											From: <a href="">ThemePixels Team</a><span>2 hours ago</span><a class="subject" href="">Thank you for using StarLight Template</a>
											<p>
												Hi,Eiusmod tempor incididunt ut labore et dolore magna aliqua.
											</p>
										</div>
									</li>
									<li class="message">
										<div class="msg">
											From: <a href="">Katherine Kate</a><span>40m ago</span>
											<p>
												Lorem ipsum dolor sit amet...
											</p>
										</div>
									</li>
									<li class="message">
										<div class="msg">
											From: <a href="">ThemePixels Team</a><span>Yesterday</span><a class="subject" href="">Events for the next month</a>
											<p>
												Hi,Eiusmod tempor incididunt ut labore et dolore magna aliqua.
											</p>
										</div>
									</li>
								</ul>
								<div class="message-more">
									<a href="">See All Messages</a>
								</div>
							</div>
							<div id="activity" class="tab-pane">
								<ul class="message-list">
									<li class="user new">
										<div class="msg">
											<a href="">Justin Meller</a> added <a href="">John Doe</a> as Admin.
										</div>
									</li>
									<li class="call new">
										<div class="msg">
											You missed a call from <a href="">Porfirio</a>
										</div>
									</li>
									<li class="calendar new">
										<div class="msg">
											<a href="">Katherine Kate</a> invited you in an event <a href="">Rock Party</a>.
										</div>
									</li>
									<li class="settings">
										<div class="msg">
											<a href="">Jane Doe</a> updated her profile.
										</div>
									</li>
									<li class="follow">
										<div class="msg">
											<a href="">Jet Lee</a> is now following you.
										</div>
									</li>
								</ul>
								<div class="message-more">
									<a href="">View All Activities</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="user-panel header-divider">
				<div class="user-info"><img src="<?php echo base_url()?>webpage/img/icons/user.png" alt=""><a href="#">Admin user</a>
				</div>
				<div class="user-dropbox">
					<ul>
						<li class="user">
							<a href="">Profile</a>
						</li>
						<li class="settings">
							<a href="">Account Settings</a>
						</li>
						<li class="theme-changer dark-theme">
							<a href="javascript:void(0)" class="dark" rel="<?php echo base_url()?>webpage/css/themes/utopia-dark.css">Dark theme</a>
						</li>
						<li class="theme-changer white-theme">
							<a href="javascript:void(0)" class="white" rel="<?php echo base_url()?>webpage/css/utopia-white.css">White theme</a>
						</li>
						<li class="theme-changer wooden-theme">
							<a href="javascript:void(0)" class="wooden" rel="<?php echo base_url()?>webpage/css/themes/utopia-wooden.css">Wooden theme</a>
						</li>
						<li class="logout">
							<a href="index.html">Logout</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</div>
